function saveApiKey() {
-  localStorage.setItem(API_KEY_STORAGE_KEY, apiKey.value.trim());
+  apiKey.value = apiKey.value.trim();
+  if (apiKey.value) {
+    localStorage.setItem(API_KEY_STORAGE_KEY, apiKey.value);
+  } else {
+    localStorage.removeItem(API_KEY_STORAGE_KEY);
+  }
   notify({
     title: 'API key saved',
     type: 'success',
   });
 }

Verify each finding against the current code and only fix it if needed.

In `@frontend/src/components/Simulator/settings/ApiKeySection.vue` around lines 16
- 18, The saveApiKey routine trims the string for storage but doesn't update the
reactive apiKey state, causing a UI/storage mismatch (e.g., v-if="apiKey" still
sees the untrimmed value); before calling localStorage.setItem in function
saveApiKey (and any other save handlers), assign apiKey.value =
apiKey.value.trim() and then persist API_KEY_STORAGE_KEY using that trimmed
apiKey.value, then call notify — this ensures the reactive state and stored
value are normalized and the UI (v-if="apiKey") reflects the true saved value.

#!/bin/bash
# Verify whether Request objects are used with fetch in frontend code paths.
rg -nP --type=ts --type=tsx --type=vue -C2 '\bnew\s+Request\s*\('
rg -nP --type=ts --type=tsx --type=vue -C2 '\bfetch\s*\(\s*new\s+Request\s*\('

#!/bin/bash
# First, let's check if the file exists and read it
echo "=== Checking apiKey.ts file ==="
cat -n frontend/src/utils/apiKey.ts | head -50

echo ""
echo "=== Searching for Request object instantiation ==="
rg -n 'new\s+Request' --type=ts -C2

echo ""
echo "=== Searching for fetch calls with Request ==="
rg -n 'fetch\s*\(' --type=ts -C3 | grep -A3 -B3 "Request"

echo ""
echo "=== Checking for fetch usage patterns in frontend ==="
fd -e ts -e js frontend/src | xargs rg -l 'fetch' | head -10

#!/bin/bash
# Let's check how the SDK is being used and if Request objects could be passed
echo "=== Searching for installApiKeyFetchInterceptor usage ==="
rg -n 'installApiKeyFetchInterceptor' --type=ts

echo ""
echo "=== Searching for genlayer-js SDK usage ==="
rg -n 'from.*genlayer' --type=ts

echo ""
echo "=== Checking package.json for genlayer-js ==="
cat package.json | grep -A2 -B2 'genlayer'

#!/bin/bash
# Let's examine how the genlayer-js SDK might be making fetch calls
echo "=== Looking for GenLayerClient usage ==="
rg -n 'createClient' --type=ts -A 5 | head -30

echo ""
echo "=== Checking useGenlayer hook ==="
cat -n frontend/src/hooks/useGenlayer.ts | head -40

#!/bin/bash
# Let's verify the actual Fetch API behavior and check if there's any documentation
echo "=== Looking at how fetch is being called in the interceptor context ==="
cat -n frontend/src/utils/apiKey.ts

echo ""
echo "=== Checking if there are any direct fetch calls in the codebase ==="
rg -n 'fetch\s*\(' --type=ts frontend/src | head -20

#!/bin/bash
# Let's check the rpc.ts file to see how fetch is being used
echo "=== Checking rpc.ts fetch usage ==="
cat -n frontend/src/clients/rpc.ts | sed -n '35,50p'

echo ""
echo "=== Verify the Fetch API spec behavior documentation ==="
cat -n frontend/src/utils/apiKey.ts | sed -n '26,43p'

-        const headers = new Headers(init?.headers);
+        const headers = new Headers();
+        if (input instanceof Request) {
+          input.headers.forEach((value, key) => headers.set(key, value));
+        }
+        if (init?.headers) {
+          new Headers(init.headers).forEach((value, key) =>
+            headers.set(key, value),
+          );
+        }
         if (!headers.has('X-API-Key')) {
           headers.set('X-API-Key', apiKey);
         }
         init = { ...init, headers };

Verify each finding against the current code and only fix it if needed.

In `@frontend/src/utils/apiKey.ts` around lines 35 - 40, When input is a Request,
the current code builds headers only from init?.headers and can drop headers
present on the Request (e.g., Content-Type); update the logic that creates
Headers (the Headers(...) call and subsequent headers.set('X-API-Key', apiKey))
to merge Request headers and init.headers: if input is a Request, start with new
Headers(input.headers), then iterate over init?.headers to copy/override into
that Headers object, then only set 'X-API-Key' when not already present; keep
using the same headers variable and assign back to init = { ...init, headers }
so existing Request headers are preserved.

#!/bin/bash
# Verify requests.* calls in this file include an explicit timeout keyword.
python - <<'PY'
import ast
from pathlib import Path

path = Path("tests/integration/conftest.py")
tree = ast.parse(path.read_text())

for node in ast.walk(tree):
    if isinstance(node, ast.Call) and isinstance(node.func, ast.Attribute):
        if isinstance(node.func.value, ast.Name) and node.func.value.id == "requests":
            has_timeout = any(k.arg == "timeout" for k in node.keywords if isinstance(k, ast.keyword))
            print(f"{path}:{node.lineno} requests.{node.func.attr} timeout={has_timeout}")
PY

     for _ in range(15):
-        resp = requests.post(
-            url,
-            data=json.dumps(
-                {"jsonrpc": "2.0", "method": "eth_chainId", "params": [], "id": 1}
-            ),
-            headers={"Content-Type": "application/json"},
-        )
+        try:
+            resp = requests.post(
+                url,
+                json={"jsonrpc": "2.0", "method": "eth_chainId", "params": [], "id": 1},
+                timeout=(2, 5),
+            )
+        except requests.RequestException as exc:
+            pytest.exit(
+                f"Cannot reach backend at {url}: {exc}. "
+                "Ensure containers are running before integration tests.",
+                returncode=1,
+            )
         if resp.status_code == 429:
             pytest.exit(
                 "Rate limiting is enabled on the backend. "
                 "Set RATE_LIMIT_ENABLED=false in .env and restart containers "
                 "before running integration tests.",
                 returncode=1,
             )

Verify each finding against the current code and only fix it if needed.

In `@tests/integration/conftest.py` around lines 18 - 31, The probe request using
requests.post in conftest.py currently has no timeout and can hang; update the
call in the probe logic to pass an explicit timeout (e.g. timeout=5) and wrap
the request in a try/except that catches requests.exceptions.RequestException
(including ConnectionError and Timeout), calling pytest.exit with a clear
message and nonzero returncode when a connection error/timeout occurs; preserve
the existing resp.status_code == 429 handling for rate-limiting when the request
succeeds.